<%@ page language="java"  pageEncoding="UTF-8" errorPage="../error.jsp"%>
<%-- <%@ taglib prefix="s" uri="/struts-tags" %> --%>
<%@ taglib prefix='c' uri='http://java.sun.com/jsp/jstl/core'%>
<%
	pageContext.setAttribute("ctx", request.getContextPath());	
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<link rel="stylesheet"  type="text/css" href="${ctx}/css/default.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/js/jqueryeasyui12/themes/bootstrap/easyui.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/js/jqueryeasyui12/themes/icon.css" />
<script type="text/javascript" src="${ctx}/js/jqueryeasyui12/jquery.min.js"></script>
<script type="text/javascript" src="${ctx}/js/jqueryeasyui12/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${ctx}/js/jqueryeasyui12/locale/easyui-lang-zh_TW.js"></script>
<script type="text/javascript" src="${ctx}/js/ipebg/IPEBG.js"></script>
<script type="text/javascript" src="${ctx}/js/ipebg/COMMON.js"></script>
<script type="text/javascript">
    var ctx = '${ctx}';
    jQuery(document).ready(function(){
        
    	$("table[id=tableShow]").show();
		$('#qryGrid').datagrid({
			title:'角色列表',
			nowrap: false,
			striped: true,
			fitColumns: true,
			url: ctx + '/role.do?action=roleList',
			remoteSort: false,
			//idField:'typeCode',
			singleSelect:true,
			rownumbers:true,
			frozenColumns:[[
			    {field:'ck',checkbox:true,width:30} 
			]],
			columns:[[
				{field:'roleId',title:'Id',width:50,hidden: true},	
				{field:'roleName',title:'角色名稱',width:100},
				{field:'roleCode',title:'角色代碼',width:100},					    			    					
			    {field:'description',title:'描述',width:100},
				{field:'createdTime',title:'創建時間',width:100}	
			]],
			pagination:true,
			pageSize:10,
			pageNumber:1,
			pageList:[10]
		});
/*		var p = $('#qryGrid').datagrid('getPager');
		if (p){
			$(p).pagination({
				onBeforeRefresh:function(){
					;
				}
			});
		}*/
	});
		
     //打開增加類別信息窗口 	        
	function addRowOpen(){
		var optionWin = $("#optionWinAdd");
		if (optionWin.is(':visible')){
			;
		}else{
			optionWin.slideDown();//显示 
		}
		optionWin.find("input").val("");
		$('#method').val('add');
		optionWin.window('open');
	}
		
    //增加類別方法
	function add(){
		var validationResult = $("#addForm").form('validate');
       	if(validationResult==false){
       		$.messager.alert('系統提示','請輸入必填信息!','warning');
       		return;
       	}			
   	   	var roleCode=$("#add_roleCode").val();	  
   	   	var roleName=$("#add_roleName").val();	  
   	   	var description=$("#add_description").val();	  
   	   	//var patten=/^[\u4e00-\u9fa5\da-zA-Z\-\_]+$/; //判斷輸入框中是否含有特殊字符
   	   	//var patten01=/^[A-Z]+$/;	 
   	 	/* if (!patten01.test(typeCode) || typeCode.length !=2 ) {
			$.messager.alert('系統提示','請使用2位大寫英文字母表示一級類型代碼！','warning');
			$("#add_typeCode").focus();
			return;
		}		 */	
   	 	/* if (!patten.test(typeName)) {
   	 	 	$.messager.alert('系統提示','類型名稱不可含有特殊字符！','warning');
			$("#add_typeName").focus();
			return;
		}	 */		
        $.messager.confirm('系統提示', '您確定需要提交嗎?', function(r) {
   	    	if (r) {	              		              	           	            
	            actionUrl =  ctx + '/role.do?action=roleAdd';	    	    					    	    		 
				var fields={
						"roleCode" :roleCode,
						"roleName" :roleName,
						"description" :description
				};	   
				$.ajax({
					type: "POST",
					url : actionUrl,
					data : fields,					
					dataType : "text",
					cache : false,
					error : function(textStatus, errorThrown) {
						$.messager.alert('系統提示','系統錯誤(' + textStatus + '): '+errorThrown,'error');
					},
					success : function(data, textStatus) {						
						 $("#optionWinAdd").window('close');
						if(data == 'SUCCESS'){									
							$.messager.alert('系統提示','添加成功！','info');				
							$('#qryGrid').datagrid('load');
						}else{
							$.messager.alert('系統提示','添加失敗！','info');
						}
					}
				});                
	        }
   	    });
	 }
		
	 //打開編輯窗口方法
	 function editRowOpen(){
		var selected = $('#qryGrid').datagrid('getSelected');
		if(selected){			
			var optionWin = $("#optionWinEdit");
			if (optionWin.is(':visible')){
				;
			}else{
				optionWin.slideDown();//显示 
			}					   
			$('#method').val('edit');
			optionWin.find("#edit_roleCode").val(selected.roleCode);
			optionWin.find("#edit_roleName").val(selected.roleName);
			optionWin.find("#edit_description").val(selected.description);			
			optionWin.window('open');
		}else{
			$.messager.alert('系統提示','請先選擇一筆資料再進行修改!','info');
		}
	} 
		 
	 //編輯方法
	 function edit(){
		var validationResult = $("#editForm").form('validate');
       	if(validationResult==false){
       		$.messager.alert('系統提示','請輸入必填信息!','warning');
       		return;
       	}
       	var selected = $('#qryGrid').datagrid('getSelected');
       	var roleId = selected.roleId;
       	var roleCode=$("#edit_roleCode").val();	  
   	   	var roleName=$("#edit_roleName").val();	  
   	   	var description=$("#edit_description").val();   	    
   	   	$.messager.confirm('系統提示', '您確定需要提交嗎?', function(r) {
   	    	if (r) {	              		                                               
               actionUrl =  ctx + '/role.do?action=roleEdit';	    	    					    	    		 
	  	       var fields={
						"roleCode" :roleCode,
						"roleName" :roleName,
						"description" :description,
						"roleId" :roleId
				};	   
				
				$.ajax({
					type: "POST",
					url : actionUrl,
					data : fields,					
					dataType : "text",
					cache : false,
					error : function(textStatus, errorThrown) {
						alert("請求失敗，請聯繫管理員！");
						//$.messager.alert('系統提示','系統錯誤(' + textStatus + '): '+errorThrown,'error');
					},
					success : function(data, textStatus) {						
						$("#optionWinEdit").window('close');
						if(data == 'SUCCESS'){									
							$.messager.alert('系統提示','修改成功！','info');
							$('#qryGrid').datagrid('load');
						}else{
							$.messager.alert('系統提示','修改失敗！','info');
						}
					}
	  			});                        
   	    	
   	    	
   	    	
   	    	
   	    	}  	    	 	    	
   	    });
	 }
		 
	 //取消新增、編輯方法
	 function cancel(result){			
		 if(result == 'Add'){
			 $("#optionWinAdd").window('close');
		 }else if(result == 'Edit'){
			 $("#optionWinEdit").window('close');
		 }			 
	 }
		
	 //刪除一行數據方法
	 function deleteRow(){
		var selected = $('#qryGrid').datagrid('getSelected');
		if(selected){
			var index = $('#qryGrid').datagrid('getRowIndex', selected);
			var roleId = selected.roleId;				
			$.messager.confirm('系統提示', '您確定要刪除該記錄嗎?', function(r) {
	        	 if (r) {
	            	var params = {
						"roleId" : roleId
					};
					var actionUrl = ctx + '/role.do?action=deleteRole';							
					$.ajax({
						type: "POST",
						url : actionUrl,
						data : params,					
						dataType : "text",
						cache : false,
						error : function(textStatus, errorThrown) {
							$.messager.alert('系統提示','系統錯誤(' + textStatus + '): '+errorThrown,'error');
						},
						success : function(data, textStatus) {															
							if(data == 'SUCCESS'){
								$.messager.alert('系統提示','刪除成功！','info');
								$('#qryGrid').datagrid('deleteRow', index);				
							}else if(data == 'USED'){									
								$.messager.alert('系統提示','當前角色已被使用，不可刪除！','info');
							}else{					
								$.messager.alert('系統提示','刪除失敗！','info');
							}
						}
					});
	        	}
	        });
		}else{
			$.messager.alert('系統提示','請先選擇一筆資料再進行刪除!','info');
		}
	}
		
	//查詢方法
	function query(){
		var roleName= $("#roleName").val();
		var roleCode= $("#roleCode").val();
		var param = {
				"roleCode" : roleCode,
				"roleName" : roleName
			};	
		$('#qryGrid').datagrid('load',param);	
	}
	
  //驗證類別編碼是否存在
  function checkPartType(){
        return;
	  var typeCode = $("#add_typeCode").val();
        params = {"reusePartTypeInfoDTO.typeCode" : typeCode};
        $.ajax({
			type: "POST",
			url :  ctx + '/materialFirstClassesMaintain!checkPartType.action',
		    data : params,
			dataType : "json",
			cache : false,
			error : function(textStatus, errorThrown) {
				$.messager.alert('系統提示','請求失敗，請聯繫管理員！','info');
			},
			success : function(data, textStatus) {
			   if (data.resultMsg!=""){
				  $.messager.alert('系統提示',data.resultMsg,'info');
				  $("#add_typeCode").val("");
			  }
			}
		});
   }
</script>
</head> 
<body>    
    <div style="width:99%">
    <table id="qryGrid" toolbar="#tb"></table>
	<div id="tb">
		<form action="" id="tbFormId" style="margin:0px;margin-bottom:10px;">
		<table width="100%" id="tableShow" style="display:none;">
			<tr>
				<td width="60%" style="white-space:nowrap;">
					<a href="#" id="btnadd" class="easyui-linkbutton" iconCls="icon-add" plain="true" code="ADD" onclick="addRowOpen()">新增</a>
					<a href="#" id="btnedit" class="easyui-linkbutton" iconCls="icon-edit" plain="true" code="EDIT" onclick="editRowOpen()">修改</a>
					<a href="#" id="btncut" class="easyui-linkbutton" iconCls="icon-remove" plain="true" code="DELETE" onclick="deleteRow()">刪除</a>
				</td>
				<td width="40%" style="white-space:nowrap;padding:0px" align="right">
					<span style="font-size:13px;">角色名稱:</span>
					<input type="text" id = "roleName" />
									
					<span style="font-size:13px;">角色代碼:</span>
					<input type="text" id = "roleCode" />
					<a class="easyui-linkbutton" iconCls="icon-search" plain="true" href="#" code="QUERY" onclick="query()">查詢</a>
				</td>
			</tr>
		</table>
		</form>
	</div>
	</div>
	
	<!-- 新增角色 -->
	<div id="optionWinAdd" class="easyui-window" title="新增角色" closed="true" 
	     collapsible="false" minimizable="false" maximizable="false" draggable="false" resizable="false"
	     style="width:400px;height:300px;padding:5px;left:60px;top:50px;background: #fafafa;display:none" align="center">		
		<form id="addForm" name="addForm" action="" method="post">			
			<br>
        	<table class="formTbl" style="font-size:13px">
        	    <tr>
					<th align="right" style="width:65px">角色代碼:</th>
					<td>
					    <input type="text" id="add_roleCode"  onblur="checkRoleCode()"  style="width:80%" class="easyui-validatebox"  required="true" >				 
					    <font color="red">*</font>
					</td>
				</tr>  
        	    <tr>
					<th align="right">角色名稱:</th>
					<td>
					    <input type="text" id="add_roleName"  class="easyui-validatebox"  style="width:80%" required="true" >
					    <font color="red">*</font>
					</td>
				</tr>
				<tr>
					<th align="right">描述:</th>
					<td>
						<textarea rows="4" style="width: 80%;" id="add_description"  validType="maxLength[150]"></textarea>									
					</td>
				</tr>			
			</table>	
			<br>			
			<div style="padding:5px;text-align:center;">
				<a  href="#" class="easyui-linkbutton" icon="icon-ok" onclick="add()">保存</a>
				&nbsp;&nbsp;&nbsp;
				<a  href="#" class="easyui-linkbutton" icon="icon-cancel" onclick="cancel('Add')">取消</a>
			</div>
		</form>
	</div>  
	
	<div id="optionWinEdit" class="easyui-window" title="編輯角色" closed="true" 
	     collapsible="false" minimizable="false" maximizable="false" draggable="false" resizable="false"
	     style="width:400px;height:300px;padding:5px;left:60px;top:50px;background: #fafafa;display:none" align="center">		
		<form id="editForm" name="editForm" action="" method="post">			
			<br>
        	<table class="formTbl" style="font-size:13px">
        	    <tr>
					<th align="right" style="width:65px">角色代碼:</th>
					<td>
					    <input type="text" style="width:80%" id="edit_roleCode"   class="easyui-validatebox"  required="true" >					    					  
						<font color="red">*</font>
					</td>
				</tr> 
        	    <tr>
					<th align="right" style="width:65px">角色名稱:</th>
					<td>
					    <input type="text" style="width:80%" id="edit_roleName" name="roleName" class="easyui-validatebox"  required="true" >
					    <font color="red">*</font>
					</td>
				</tr>        	          
				<tr>
					<th align="right" style="width:65px">描述:</th>
					<td>
					   	<textarea rows="4" style="width: 80%;" id="edit_description"  validType="maxLength[150]"></textarea>
					</td>
				</tr>			
			</table>	
			<br>			
			<div style="padding:5px;text-align:center;">
				<a  href="#" class="easyui-linkbutton" icon="icon-ok" onclick="edit()" >保存</a>
				&nbsp;&nbsp;&nbsp;
				<a  href="#" class="easyui-linkbutton" icon="icon-cancel" onclick="cancel('Edit')" >取消</a>
			</div>
		</form>
	</div>  
  </body>
</html>